﻿@{
    Layout = "~/Views/Shared/_LayuiLayout.cshtml";
}

@model CommodityOutput

<form class="layui-form layui-form-pane">
    @Html.AntiForgeryToken()
    <input type="hidden" value="@Model.Id" name="Id" />
    <div class="layui-form-item">
        <label class="layui-form-label">名称</label>
        <div class="layui-input-block">
            <input type="text" class="layui-input" name="Name" value="@Model.Name" lay-verify="required" required>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"> 分类</label>
        <div class="layui-input-block">
            <select name="CategoryId" lay-verify="required" lay-search="">
                <option value="">请选择</option>
                @foreach (var item in ViewBag.CategoryList)
                {
                    <option value="@item.Id" @(Model.CategoryId == item.Id ? "selected=selected" : "")>@item.Name</option>
                }
            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">库存量</label>
        <div class="layui-input-block">
            <input type="number" class="layui-input" name="Number" value="@Model.Number" lay-verify="required" required>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">价格</label>
        <div class="layui-input-block">
            <input type="text" class="layui-input" name="Money" value="@Model.Money" lay-verify="required" required>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">简介</label>
        <div class="layui-input-block">
            <textarea name="Introduce" placeholder="请输入简介" class="layui-textarea">@Model.Introduce</textarea>
        </div>
    </div>
    <div style="width:25%; float: left; margin:20px 0 0 5%; text-align: center;">
        <input type="hidden" value="@Model.Pic" name="Pic" id="Pic" />
        <button type="button" class="layui-btn layui-btn-normal" id="btnImg">商品图片</button>
        <div class="layui-upload-list">
            <img class="layui-upload-img" src="@Model.Pic" id="PicView" style="height:300px;width:400px;border:1px solid #EEEEEE;" alt="商品图片">
        </div>
    </div>
    <div class="layui-form-item" align="center">
        <button type="button" class="layui-btn" lay-submit="" lay-filter="Save">保存</button>
        <button type="button" class="layui-btn layui-btn-primary" id="btnCancel">取消</button>
    </div>
</form>

@section scripts{
    <script type="text/javascript">
        var $, layer;
        layui.use(['form', 'layer',  'upload'], function () {
            var form = layui.form;
            var upload = layui.upload;
            $ = layui.jquery;
            layer = parent.layer === undefined ? layui.layer : parent.layer;

            // 监听关闭
            $('#btnCancel').on('click', function () {
                layer_close();
            });

            // 最大允许上传的单个文件大小(kb)
            var sizeMax = 1024*5;
            var uploadIns = upload.render({
                    elem: '#btnImg',
                    method: 'post',
                    url: '@Url.Action("UpLoadCommondityPic", "File")',
                    accept: 'images',
                    exts: 'jpg|png|gif|bmp|jpeg',
                    size: sizeMax,
                    before: function (obj) {
                        obj.preview(function (index, file, result) {
                            $('#PicView').attr('src', result); //图片链接（base64）
                        });
                    },
                    done: function (res, index, upload) {
                        if (res.code == 0) {   // 上传成功
                            layer.msg('图片上传成功', { icon: 1, time: 2000 });
                            $('#Pic').val(res.data[0].src);
                        } else {
                            layer.alert(res.msg, { icon: 2 });
                        }
                    },
                    error: function (index, upload) {
                        layer.msg('上传失败！', { icon: 2, time: 1000 });
                    }
            });

            var postUrl = '@(Url.Action(Model.Id > 0 ? "Edit" : "Add", "Commodity"))';

            // 监听提交
            form.on('submit(Save)', function (data) {
                var loading = layer.load();
                $.post(postUrl, data.field,
                    function (result) {
                        layer.close(loading);
                        if (result.Success) {
                            layer.msg(result.Message, { icon: 1, time: 2000 });
                            parent.reload();
                            layer_close();
                        } else {
                            layer.alert(result.Message, { icon: 2 });
                        }
                    });
                return false;
            })

        });
    </script>
}



